<template>
  <div class="search-song-Lists">
    <SongListOfContent :listOfSongList="listOfSongList"></SongListOfContent>
  </div>
</template>

<script>
import SongListOfContent from "@/components/SongListOfContent";
export default {
  name: "SearchSongLists",
  components:{
    SongListOfContent
  },
  mounted() {
    this.getSongList()
  },
  methods: {
    async getSongList() {
      if (!this.$route.query.keyWords) {
        this.$notify({
          title: '警告',
          message: '你未输入歌曲',
          type: 'warning'
        })
      } else {
        let result = await this.$API.reqShowSongListFromName(this.$route.query.keyWords)
        if (result.code == 10000) {
          this.listOfSongList = result.data
        } else {
          this.$notify({
            title: '警告',
            message: '暂时没有该歌单',
            type: 'warning'
          })
          await Promise.reject(new Error('fail'))
        }
      }
    }
  },
  data() {
    return {
      listOfSongList: []
    }
  }
}
</script>

<style lang="scss" scoped>
@import 'src/assets/css/search-song-lists.scss';
</style>

